<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <h1>原生 WebSocket 实现</h1>

    <button id="btn">主动给服务端发消息</button>

    <script>
      // 建立 WebSocket 链接
      //    ws  一种协议类似 http
      //    wss 一种协议类似 https
      const socket = new WebSocket("ws://127.0.0.1:3000");

      // 监听 onmessage 事件
      //    触发时机，服务端调用 socket.send()
      socket.onmessage = function (e) {
        console.log("接收到服务端的消息了", e);
      };

      btn.onclick = function () {
        // alert(111);
        // 向服务端发消息
        socket.send("来了老铁");
      };
    </script>
  </body>
</html>
